<template>
  <div class="child1">
    <h3>我是子组件1:曹植</h3>
  </div>
</template>

<script setup lang="ts">
  import $bus from "../../bus";
  //组合式API函数
  import { onMounted,ref } from "vue";
  const listArray = ref([
    {
      name: "曹植",
      age: 18
    },
    {
      name: "曹操",
      age: 20
    },
    {
      name: "曹丕",
      age: 22
    },
    {
      name: "曹操",
      age: 20
    },
    {
      name: "曹丕",
      age: 22
    },   
  ])
  function handleList(){
    listArray.value = listArray.value.filter((item,index,self)=>{
      return self.indexOf(item) === index
    })
    console.log(listArray.value);
  }
  handleList()
  //组件挂载完毕的时候,当前组件绑定一个事件,接受将来兄弟组件传递的数据
  onMounted(() => {
    //第一个参数:即为事件类型  第二个参数:即为事件回调
    $bus.on("car", (car) => {
      console.log(car);
    });
  });
</script>

<style scoped>
.child1 {
  width: 300px;
  height: 300px;
  background: hotpink;
}
</style>